{% extends "base.html" %}
{% load staticfiles %}
{% load humanize %}
{% load article_favorites %}
{% load article_comments %}
{% load bootstrap_pagination %}

{% block site_css %}
{{ block.super }}
<link href="{% static 'css/detail.css' %}" rel="stylesheet">
{% endblock %}

{% block content %}
    <div class="well well-sm">
        <h3>{{ article.title }}</h3>
        {% include 'partial_share.html' %}
        <h5>英文原文：<a target="_blank" href="{{ article.original_link }}">{{ article.original_title }}</a></h5>
        <small><a href="{{ article.recommend_user.profile.get_absolute_url }}">{{ article.recommend_user.profile }}</a> 推荐于 {{ article.recommend_date|naturaltime }} (共 {{ article.section_set.count }} 段{% if article.status == article.TRANSLATED %}, 翻译完成于 {{ article.translated_date|date:"SHORT_DATE_FORMAT" }}{% endif %})</small>
        <p><small>参与翻译({{ translators|length }}人){% for translator in translators %}{% if not forloop.counter0 %}：{% endif %}<a href="{{ translator.profile.get_absolute_url }}">{{ translator.profile }}</a>{% endfor %}{% render_favorite_case user article %}</small></p>
    </div>
    <div style="padding: 0px 10px 5px;">
        {% if article.status == article.TRANSLATED %}
        <span class="pull-right">
            <a href="{{ mode_urls.ch }}">仅中文</a> |
            <a href="{{ mode_urls.en }}">仅英文</a> |
            <a href="{{ mode_urls.contrast }}">中英文对照</a>
        </span>
        {% else %}
        <span class="pull-left">翻译中({{ article.translate_rate }}%) ...</span>
        {% endif %}
    </div>

    <hr>

    {% if mode == 'contrast' %}
    <div class="contrast">
    {% else %}
    <div class="general">
    {% endif %}

    {% for p in sections %}
    {% if forloop.counter0 %}<hr>{% endif %}
    <div class="row">
        {% if mode == 'contrast' %}
        <div class="col-md-6" style="border-right:1px solid #EEE;">
            <p>{{ p.content|safe }}</p>
        </div>
        <div class="col-md-6">
            <p>{{ p.best_translation.content|safe }}</p>
        </div>
        {% else %}
        <div class="col-md-10" style="border-right:1px solid #EEE;">
            {% if p.has_translated and mode != 'en' %}
            <p>{{ p.best_translation.content|safe }}</p>
            {% else %}
            <p>{{ p.content|safe }}</p>
            {% endif %}
        </div>
        <div class="col-md-2">
            <p>{% if article.status != article.TRANSLATED %}已有{% endif %}{{ p.translation_set.all|length }}人翻译此段</p>
            {% if article.status != article.TRANSLATED %}
            <a class="btn btn-primary" href="{% url 'translations:translate' p.id %}">我要翻译</a>
            {% endif %}
        </div>
        {% endif %}
    </div>
    {% endfor %}

    </div>

    <hr>

    <blockquote>
        <p>本文中的所有译文仅用于学习和交流目的，转载请务必注明文章译者、出处、和本文链接<br>
        我们的翻译工作遵照 <a href="http://zh.wikipedia.org/wiki/Wikipedia:CC" target="_blank">CC 协议</a>，如果我们的工作有侵犯到您的权益，请及时联系我们</p>
    </blockquote>

    {% if sections.paginator.num_pages > 1 %}
        <hr>
        {% bootstrap_paginate sections range=10 %}
    {% endif %}

    {% render_article_comments request article %}
{% endblock %}